<template>
    <!-- 
    GET_PAT_FEELIST 测试接口用
select 
pat_no,pat_name,charge_typeno,req_wardno,req_bedno,req_deptno,req_docno,perform_dept,charge_user,charge_dt,
'111'as fee_itemcode,
'收费名称'as fee_itemname ,
cast('5.00' as decimal(6, 2)) as item_price,
'2' as qty,
'10.5' as amount,
'20.5' as real_amount,
'20200107321' as his_recordid,
'19980507123' as his_refcol1,
'19980507123' as his_refcol2,
'19980507123' as his_refcol3,
PRINT_COUNT  as charge_flag
from Req_Master as rm
left join req_master_pat as rmp on rm.barcode = rmp.barcode
where rm.charge_dt >='@3' and rm.charge_dt<'@4' 
and (rmp.pat_typecode ='@1' or '@1' = '%') 
and (rmp.pat_no = '@2' or '@2' = '%') 
and (rmp.perform_dept='@7' or '@7' = '%')
and (rmp.pat_name = '@8' or '@8' = '%')
and (rmp.req_deptno = '@9' or '@9' = '%')
and (rmp.req_wardno = '@10' or '@10' = '%') -->
    <div style="height: 100%; width: 100%; position: relative;" ref="maindev">
        <div class="pagetop" :style="{ height: '99px' }">
            <table style="width: 100%; font-size: 12px;" border="0">
                <col style="width: 4%;" />
                <col style="width: 8%;" />
                <col style="width: 1%;" />
                <col style="width: 8%;" />
                <col style="width: 4%;" />
                <col style="width: 11%;" />
                <col style="width: 4%;" />
                <col style="width: 11%;" />
                <col style="width: 4%;" />
                <col style="width: 11%;" />
                <col style="width: 43%;" />
                <tr>
                    <td align="right">收费日期</td>
                    <td>
                        <el-date-picker v-model="searchobj.strdate" :clearable="false" type="datetime" placeholder="选择日期"
                            value-format="yyyy-MM-dd HH:mm:ss" style="width: 100%;min-width: 150px;"> </el-date-picker>
                    </td>
                    <td>至</td>
                    <td>
                        <el-date-picker v-model="searchobj.enddate" type="datetime" :clearable="false" placeholder="选择日期"
                            value-format="yyyy-MM-dd HH:mm:ss" style="width: 100%;min-width: 150px;"> </el-date-picker>
                    </td>
                    <td align="right">病历号</td>
                    <td>
                        <el-input size="small" style="width:100%;" v-model="searchobj.patno" clearable
                            @focus="Focus($event)"></el-input>
                    </td>
                    <td align="right">病人类型</td>
                    <td>
                        <rm-ddl-common datatype="seccode" kindno="PT" dataname="病人类型" v-model="searchobj.pattypecode"
                            width="200px" key="pt"></rm-ddl-common>
                    </td>
                    <td align="right">执行科室</td>
                    <td>
                        <rm-ddl-common datatype="dept" dataname="科室" v-model="searchobj.peformedeptno"
                            width="100%"></rm-ddl-common>
                    </td>
                </tr>
                <tr>
                    <td colspan="4">
                    </td>
                    <td align="right">病人姓名</td>
                    <td>
                        <el-input size="small" style="width:100% ;" v-model="searchobj.patname"></el-input>
                    </td>
                    <td align="right">申请科室</td>
                    <td>
                        <rm-ddl-common datatype="dept" dataname="申请科室" v-model="searchobj.req_deptno" width="width:100%"
                            :appendtobody="true"></rm-ddl-common>
                    </td>
                    <td align="right">申请病区</td>
                    <td>
                        <rm-ddl-common :appendtobody="true" datatype="ward" dataname="病区" v-model="searchobj.reqwardno"
                            width="100%"></rm-ddl-common>
                    </td>
                </tr>
                <tr>
                    <td colspan="11" align="right">
                        <el-button @click.native="BtnQuery" v-has="'PINQUERY'" type="primary"
                            icon="el-icon-search">查询</el-button>
                        <el-button @click.native="BtnClear" icon="el-icon-close">清除</el-button>
                        <el-button @click.native="BtnExport" icon="el-icon-upload2">导出</el-button>
                    </td>
                </tr>
            </table>
        </div>
        <div class="pagecenter" :style="{ top: '103px' }">
            <div class="middle-center">
                <vxe-table :data.sync="tableData" :select-config="{ reserve: true }" :sort-config="{ trigger: 'cell' }"
                    border height="100%" highlight-current-row class="mytable-style" highlight-hover-column
                    highlight-hover-row ref="xTable" resizable size="mini" stripe :optimization="{ animat: true }"
                    header-align="center" :key="xTablekey" show-footer :footer-method="FooterMethod" :loading="bLoading"
                    :footer-cell-class-name="FooterCellClassName">
                    <vxe-table-column field="pat_no" sortable title="病历号" width="100" show-overflow></vxe-table-column>
                    <vxe-table-column field="pat_name" align="center" sortable title="姓名" width="50"
                        show-overflow></vxe-table-column>
                    <vxe-table-column field="charge_dt" align="center" sortable title="计价时间" width="120"
                        show-overflow></vxe-table-column>
                    <vxe-table-column field="fee_itemname" sortable title="收费项目名称" width="150"
                        show-overflow></vxe-table-column>
                    <vxe-table-column field="item_price" header-align="center" align="right" sortable title="单价" width="60"
                        show-overflow></vxe-table-column>
                    <vxe-table-column field="qty" align="center" sortable title="数量" width="50"
                        show-overflow></vxe-table-column>
                    <vxe-table-column field="amount" header-align="center" align="right" sortable title="应收金额" width="80"
                        show-overflow></vxe-table-column>
                    <vxe-table-column field="real_amount" header-align="center" align="right" sortable title="实收金额"
                        width="80" show-overflow></vxe-table-column>
                    <vxe-table-column field="req_deptno" sortable title="申请科室" width="120" show-overflow
                        :formatter="FormatFun"></vxe-table-column>
                    <vxe-table-column field="req_bedno" align="center" sortable title="床号" width="40"
                        show-overflow></vxe-table-column>
                    <vxe-table-column field="req_docno" align="center" sortable title="申请医生" width="70" show-overflow
                        :formatter="FormatFun"></vxe-table-column>
                    <vxe-table-column field="perform_dept" sortable title="执行科室" width="120" show-overflow
                        :formatter="FormatFun"></vxe-table-column>
                    <vxe-table-column field="charge_user" sortable title="计价人" width="50" show-overflow
                        :formatter="FormatFun"></vxe-table-column>
                    <vxe-table-column field="charge_typeno" align="center" sortable title="收费类别" width="90" show-overflow
                        :formatter="FormatFun"></vxe-table-column>
                    <vxe-table-column field="req_wardno" sortable title="病区" width="120" show-overflow
                        :formatter="FormatFun"></vxe-table-column>
                    <vxe-table-column field="fee_itemcode" sortable title="收费项目代码" width="100"
                        show-overflow></vxe-table-column>
                    <vxe-table-column field="his_recordid" sortable title="HIS收费记录号" width="100"
                        show-overflow></vxe-table-column>
                    <vxe-table-column field="his_refcol1" sortable title="HIS相关信息1" width="90"
                        show-overflow></vxe-table-column>
                    <vxe-table-column field="his_refcol2" sortable title="HIS相关信息2" width="90"
                        show-overflow></vxe-table-column>
                    <vxe-table-column field="his_refcol3" sortable title="HIS相关信息3" width="90"
                        show-overflow></vxe-table-column>
                    <vxe-table-column field="charge_flag" sortable title="计价标志" width="100" align="center" show-overflow
                        :formatter="FormatFun"></vxe-table-column>
                </vxe-table>
            </div>
        </div>
    </div>
</template>

<script type="text/javascript">
import XE from "xe-utils";
export default {
    name: "LIS432",
    data() {
        return {
            bLoading: false,
            bDlgInvItem: false,
            dlgInvItemKey: 0,
            currRowIndex: 0,
            xTablekey: 0,
            tableData: [],
            itemcnt: 0,
            searchobj: {
                //查询框初始值
                pattypecode: "", //病人类型 %＝全部
                patno: "", //病历号：%＝全部
                strdate: XE.toDateString(XE.getWhatDay(new Date()), "yyyy-MM-dd") + " 00:00:00", //开始时间 >=该时间
                enddate: XE.toDateString(new Date(), "yyyy-MM-dd") + " 23:59:59", //结束时间 <该时间
                querymethods: "LIS", //查询方式：LIS＝检验，BLD＝血库，等等
                chargetype: "", //费用类别：H=血费，C＝检验费，%＝全部
                peformedeptno: "", //执行科室
                patname: "", //病人姓名
                reqdeptno: "", //申请科室
                reqwardno: "", //申请病区
            },
            deptOption: [],
            doctorOption: [],
            wardOption: [],
            chargetypeOption: [],
            chargeflagOption: [
                { data: "0", display: "未确认计价" },
                { data: "1", display: "已计价" },
            ],
        };
    },
    created() {
        this.initOption();
    },
    methods: {
        //添加初始化option 用于format 
        async initOption() {
            try {
                const res = await this.$tool.request({
                    url: "LIS/LIS4/LIS432",
                    method: "post",
                    data: {
                        action: "getOption",
                    },
                });

                this.deptOption = res.deptOption; //科室
                this.doctorOption = res.doctorOption; //医生
                this.wardOption = res.wardOption; //病区
                this.chargetypeOption = res.chargetypeOption; //收费类别
            } catch (e) {
                this.$message.warning(e);
            }
        },
        BtnQuery() {
            this.BtnQuery1();
        },
        BtnClear() {
            this.searchobj = {
                //查询框初始值
                pattypecode: "", //病人类型 %＝全部
                patno: "", //病历号：%＝全部
                strdate: XE.toDateString(XE.getWhatDay(new Date()), "yyyy-MM-dd") + " 00:00:00", //开始时间 >=该时间
                enddate: XE.toDateString(new Date(), "yyyy-MM-dd") + " 23:59:59", //结束时间 <该时间
                querymethods: "LIS", //查询方式：LIS＝检验，BLD＝血库，等等
                chargetype: "", //费用类别：H=血费，C＝检验费，%＝全部
                peformedeptno: "", //执行科室
                patname: "", //病人姓名
                reqdeptno: "", //申请科室
                reqwardno: "", //申请病区
            };
            this.tableData = [];
        },
        BtnExport() {
            let options = {
                filename: "LIS432 病人HIS收费记录查询.csv",
            };
            this.$refs.xTable.exportCsv(options);
        },
        async BtnQuery1() {
            this.bLoading = true;
            this.tableData = [];
            this.itemcnt = 0;
            this.searchobj.strdate = XE.toDateString(this.searchobj.strdate, "yyyy-MM-dd HH:mm:ss.SSS");
            this.searchobj.enddate = XE.toDateString(this.searchobj.enddate, "yyyy-MM-dd HH:mm:ss.SSS");
            this.$tool
                .request({
                    url: "LIS/LIS4/LIS432",
                    method: "post",
                    timeout: 600000,
                    data: {
                        action: "query",
                        ...this.searchobj,
                    },
                })
                .then((res) => {
                    console.log("res", res);
                    this.itemcnt = res.lstdt.length;
                    if (res.flag == 1) {
                        this.tableData = res.lstdt;
                    }
                    this.bLoading = false;
                })
                .catch((e) => {
                    this.bLoading = false;
                    // this.$message.warning(e)
                    console.log("e", e);
                });
        },
        //点击触发文本内容全选
        Focus(event) {
            event.currentTarget.select();
        },
        FooterCellClassName({ $rowIndex, column, columnIndex }) {
            if (["fee_itemname", "amount", "real_amount"].includes(column.property)) {
                return "colcnt";
            }
        },
        FooterMethod({ columns, data }) {
            return [
                columns.map((column, columnIndex) => {
                    //避免其余行拖动到首位导致合计数量消失
                    if (!["spec", "warehousename", "itemname", "unit", "vendorname", "manufacturername"].includes(column.property)) {
                        if (column.property == "fee_itemname") {
                            return "共" + this.itemcnt + "条";
                        }
                        if (column.property == "amount") {
                            return XE.sum(data, column.property).toFixed(2);
                        }
                        if (column.property == "real_amount") {
                            return XE.sum(data, column.property).toFixed(2);
                        }
                    }
                    return null;
                }),
            ];
        },
        CellClassName({ row, rowIndex, column, columnIndex }) { },
        //添加format
        FormatFun({ cellValue, column, row }) {
            console.log("111");
            if (["req_deptno", "perform_dept"].includes(column.property)) {
                //申请科室 or 执行科室
                try {
                    let na = this.deptOption.find((m) => m.data == cellValue);
                    if (na != undefined && na != null) {
                        return na.display;
                    } else {
                        return cellValue;
                    }
                } catch { }
            } else if (["req_docno", "charge_user"].includes(column.property)) {
                //申请医生 or   //计价人
                try {
                    let na = this.doctorOption.find((m) => m.data == cellValue);
                    if (na != undefined && na != null) {
                        return na.display;
                    } else {
                        return cellValue;
                    }
                } catch { }
            } else if (column.property == "charge_typeno") {
                //收费类别
                try {
                    let na = this.invorgOptions.find((m) => m.data == cellValue);
                    if (na != undefined && na != null) {
                        return na.display;
                    } else {
                        return cellValue;
                    }
                } catch { }
            } else if (column.property == "req_wardno") {
                //病区
                try {
                    let na = this.wardOption.find((m) => m.data == cellValue);
                    if (na != undefined && na != null) {
                        return na.display;
                    } else {
                        return cellValue;
                    }
                } catch { }
            } else if (column.property == "charge_flag") {
                //计价标志
                try {
                    let na = this.chargeflagOption.find((m) => m.data == cellValue);
                    if (na != undefined && na != null) {
                        return na.display;
                    } else {
                        return cellValue;
                    }
                } catch { }
            }
        },
    },
};
</script>

<style scoped>
table {
    font-size: 12px;
    border-collapse: separate;
    border-spacing: 5px;
    white-space: nowrap;
}

.pagetop {
    width: 100%;
    height: 120px;
    display: -webkit-box;
    -webkit-box-pack: left;
    -webkit-box-align: center;
    border: 1px solid #ccc;
    position: absolute;
    z-index: 99;
}

.pagecenter {
    position: absolute;
    top: 125px;
    width: 100%;
    left: 0;
    bottom: 0px;
    overflow: auto;
}

.middle-center {
    position: absolute;
    height: 100%;
    left: 0px;
    right: 0px;
    overflow: auto;
}

::v-deep .mytable-style .vxe-body--row.row-blue {
    color: rgb(157, 158, 161) !important;
    font-weight: bold;
}

::v-deep .el-checkbox__label {
    padding-left: 5px;
}

::v-deep .el-icon-time {
    line-height: 18px !important;
}

::v-deep .el-range__close-icon {
    line-height: 18px !important;
}

::v-deep .el-range-editor--small .el-range-separator {
    line-height: 17px !important;
}

::v-deep .el-input--suffix .el-input__inner {
    padding-right: 0px;
}

::v-deep .colcnt {
    background-color: #eee8aa !important;
    font-weight: 700px;
    text-align: center;
}

::v-deep .el-checkbox__label {
    display: inline-block;
    font-size: 12px;
}</style>